<template>
  <!-- 务必看懂下面这行代码 -->
  <h2 a="1+1" :b="1+1" c="x" :d="x" ref="qwe">测试</h2>
  <Person a="哈哈" b="呵呵" :list="personList"/>

</template>

<script lang="ts" setup name="App">
import Person from './components/Person.vue'
import {reactive} from 'vue'
import {type Persons} from '@/types'


let x = 9

// let personList: Persons = reactive([
//   {id: 'sdowje13', name: 'John', age: 30},
//   {id: 'dowj123', name: 'Jane', age: 25},
//   {id: 'dowj156', name: 'Bob', age: 40}
// ])

// 推荐这种方式
let personList = reactive<Persons>([
  {id: 'sdowje13', name: 'John', age: 30},
  {id: 'dowj123', name: 'Jane', age: 25},
  {id: 'dowj156', name: 'Bob', age: 40, x: 100}
])

console.log(personList)
</script>

